@extends('admin.layouts.master')

@section('pagecss')
<link rel="stylesheet" type="text/css" href="/admin/assets/bootstrap-datepicker/css/datepicker.css" />
@endsection

@section('content')

<div class="row">
	<div class="col-lg-12">
		<section class="panel aw-content">
			<header class="panel-heading">锁定场地</header>
			<div class="aw-mt20 overflow-hidden">
				<div class="col-md-3"></div>
				<div class="col-sm-12 col-md-6 form-group overflow-hidden">
					<div class="col-sm-12 aw-p0 form-group overflow-hidden">
						<div class="col-xs-3 aw-p0 aw-list-input-title">选择店面：</div>
						<div class="col-xs-9 aw-p0">
							<select placeholder="请选择店面" id="store_id" name="store_id" v-model="form.store_id" :value="form.store_id" class="form-control">
								<option v-for="(list,key) in list_store" :value="list.id">@{{list.store_name}}</option>
							</select>
						</div>
					</div>
					<div class="col-sm-12 aw-p0 form-group overflow-hidden">
						<div class="col-xs-3 aw-p0 aw-list-input-title">选择场地：</div>
						<div class="col-xs-9 aw-p0">
							<select placeholder="请选择场地类型" id="field_id" name="field_id" v-model="form.field_id" :value="form.field_id" class="form-control">
								<option v-for="(list,key) in list_type" :value="list.id">@{{list.type_text}} (@{{list.number}}号)</option>
							</select>
						</div>
					</div>
					<div class="col-sm-12 aw-p0 form-group overflow-hidden">
						<div class="col-xs-3 aw-p0 aw-list-input-title">选择场次：</div>
						<div class="col-xs-9 aw-p0">
							<select placeholder="请选择场次" id="start_time" name="start_time" v-model="form.start_time" :value="form.start_time" class="form-control">
								<option v-for="(list,key) in list_time" :value="list.start_time">@{{list.start_time}}-@{{list.end_time}}</option>
							</select>
						</div>
					</div>
					<div class="col-sm-12 aw-p0 form-group overflow-hidden">
						<div class="col-xs-3 aw-p0 aw-list-input-title">开始时间：</div>
						<div class="col-xs-9 aw-p0"><input type="text" placeholder="请选择开始时间" id="lock_start_time" name="lock_start_time" v-model="form.lock_start_time" :value="form.lock_start_time" class="form-control"></div>
					</div>
					<div class="col-sm-12 aw-p0 form-group overflow-hidden">
						<div class="col-xs-3 aw-p0 aw-list-input-title">结束时间：</div>
						<div class="col-xs-9 aw-p0"><input type="text" placeholder="请选择结束时间" id="lock_end_time" name="lock_end_time" v-model="form.lock_end_time" :value="form.lock_end_time" class="form-control"></div>
					</div>
					<div class="col-sm-12 aw-p0 form-group overflow-hidden">
						<div class="col-xs-3 aw-p0 aw-list-input-title">重复：</div>
						<div class="col-xs-9 aw-p0">
							<div class="col-xs-6 aw-pl0">
								<select id="rep_model" name="rep_model" v-model="form.rep_model" :value="form.rep_model" class="form-control">
									<option value="1">每周</option>
									<option value="2">每月</option>
								</select>
							</div>
							<div class="col-xs-6 aw-pr0">
								<select v-if="form.rep_model==1" id="set_value" name="set_value" v-model="form.set_value" :value="form.set_value" class="form-control">
									<option value="7">星期天</option>
									<option value="1">星期一</option>
									<option value="2">星期二</option>
									<option value="3">星期三</option>
									<option value="4">星期四</option>
									<option value="5">星期五</option>
									<option value="6">星期六</option>
								</select>
								<select v-if="form.rep_model==2" id="set_value" name="set_value" v-model="form.set_value" :value="form.set_value" class="form-control">
									<option v-for="(list,key) in list_date" :value="list">@{{list}}</option>
								</select>
							</div>
						</div>
					</div>
					<div class="col-sm-12 aw-overflow-hidden aw-content-btn"><button type="submit" class="btn btn-gules" v-on:click="Lock()">锁定</button></div>
				</div>
			</div>
		</section>
	</div>
</div>


@section('pagejs')
@parent

<!--日期插件-->
<script type="text/javascript" src="/admin/js/ga.js"></script>
<script type="text/javascript" src="/admin/assets/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>

<script type="text/javascript">
var Get_form={
	store_id:'',field_id:'',start_time:'',rep_model:1,set_value:'',lock_start_time:'',lock_end_time:'',this_time:DateToday(),
}
var AD_list_store={
	api:'/adminapi/storefront/list',
	form_data:{page_num:100},
	tips:false,
}
//场地类型
var AD_list_field_type={
	api:'/adminapi/field/list',
	form_data:{page_num:100},
	tips:false,
}
//场地时间表
var AD_list_field_time={
	api:'/adminapi/field/time-list',
	form_data:{page_num:100},
	tips:false,
}
var Data_date_list=[];
for(var i=1;i<31;i++){
	Data_date_list.push(i)
}
var Ajax_Vue_Fun_Store=function(vue_data){
	vm=new Vue({
		el:'#Vue-Body',
		data:{
			list_store:vue_data.list,
			list_time:{},
			list_type:{},
			list_date:Data_date_list,
			form:Get_form
		},methods:{
			Lock:function(){
				if(!this.form.store_id){
					msgTips(Placeholder_Text('#store_id'),2)
					return;
				}
				if(!this.form.lock_start_time){
					msgTips(Placeholder_Text('#lock_start_time'),2)
					return;
				}
				if(!this.form.lock_end_time){
					msgTips(Placeholder_Text('#lock_end_time'),2)
					return;
				}
				var AD_lock={
					api:'/adminapi/field/lock',
					form_data:this.form,
					tips:'锁定场地成功',
					//to_url:'/admin/field/list?page_id=23',
				}
				postData(AD_lock)
			},Field_Select:function(){
				
			}
		},watch:{
	        'form.store_id':function(val,oldval){
	            console.log('门店改变')
	            console.log(val,oldval)
	            console.log(oldval)
	            AD_list_field_type.form_data.store_id=this.form.store_id;
	            getData(AD_list_field_type,Ajax_Vue_Fun_Field_Type)
	        },'form.field_id':function(val,oldval){
	            console.log('场地改变改变')
	            console.log(val,oldval)
	            console.log(oldval)
	            AD_list_field_time.form_data.field_id=this.form.field_id;
	            getData(AD_list_field_time,Ajax_Vue_Fun_Field_Time)
	        },'form.rep_model':function(val,oldval){
	            console.log('重复改变')
	            console.log(val,oldval)
	            console.log(oldval)
	            if(val==1){
	            	vm.form.set_value=7;
	            }
	            if(val==2){
	            	vm.form.set_value=1;
	            }
	        },'form.lock_start_time':function(val,oldval){
	            console.log('开始时间')
	            console.log(val,oldval)
	            console.log(val)
	            var is_time=If_Time_Max(this.form.this_time,this.form.lock_start_time)
	            console.log(is_time)
	            if(is_time==6){
	            	msgTips('不能是过去的时间,请重新设置',2)
	            	$('#lock_start_time').datepicker('show') 
	            }else if(is_time==9){
	            	$('#lock_end_time').datepicker('show') 
	            }
	        },'form.lock_end_time':function(val,oldval){
	            console.log('结束时间')
	            console.log(val,oldval)
	            console.log(val)
	            if(!this.form.lock_start_time){
	            	msgTips('请先设置开始时间',2)
	            	$('#lock_start_time').datepicker('show') 
	            }
	            var is_time=If_Time_Max(this.form.lock_start_time,this.form.lock_end_time)
	            console.log(is_time)
	            if(is_time==6){
	            	msgTips('不能是开始时间之前的时间,请重新设置',2)
	            	$('#lock_end_time').datepicker('show') 
	            }else if(is_time==9){}
	        }
    	}
	})
	vm.form.store_id=$('#store_id option:eq(0)').val()
	
	AD_list_field_type.form_data.store_id=vm.form.store_id;
	
	vm.form.start_time=$('#start_time option:eq(0)').val()
	vm.form.rep_model=$('#rep_model option:eq(0)').val()
	$('#lock_start_time').datepicker({
	    format:'yyyy-mm-dd',
	}).on('changeDate',Select_Date_start_time);
	function Select_Date_start_time(ev){
		var This_day=ev.date.getFullYear().toString() + "-"+ (ev.date.getMonth()+1).toString()+ "-"+ ev.date.getDate().toString()
		Select_Date(ev,'lock_start_time')
    }
    $('#lock_end_time').datepicker({
	    format:'yyyy-mm-dd',
	}).on('changeDate',Select_Date_end_time);
	function Select_Date_end_time(ev){
		var This_day=ev.date.getFullYear().toString() + "-"+ (ev.date.getMonth()+1).toString()+ "-"+ ev.date.getDate().toString()
		Select_Date(ev,'lock_end_time')
    }
	function Select_Date(ev,val){
		var This_day=ev.date.getFullYear().toString() + "-"+ (ev.date.getMonth()+1).toString()+ "-"+ ev.date.getDate().toString()
		if(val=='lock_start_time'){
			vm.form.lock_start_time=This_day;
		}
		if(val=='lock_end_time'){
			vm.form.lock_end_time=This_day;
		}
		$('#'+val).val(This_day)
		$('#'+val).blur()
    }
}
var Ajax_Vue_Fun_Field_Type=function(vue_data){
	vm.list_type=vue_data.list;
	console.log('111111111111111111111111111')
	console.log($('#field_id option:eq(0)'))
	vm.form.field_id=vm.list_type[0].id;
}
var Ajax_Vue_Fun_Field_Time=function(vue_data){
	vm.list_time=vue_data;
	//vm.form.start_time=$('#start_time option:eq(0)').val()
	vm.form.start_time=vue_data[0].start_time;
}
getData(AD_list_store,Ajax_Vue_Fun_Store)
</script>
@endsection

@endsection

